<template>
  <div class="content">
    <div class="header">
      <!-- <el-row type="flex">
        <el-row type="flex">
          <el-button
            class="searchBtn"
            size="small"
            type="success"
            icon="el-icon-s-check"
            @click="$router.push('/video/video/videoList')"
          >视频审核</el-button>
          <el-button
            class="searchBtn"
            size="small"
            type="primary"
            icon="el-icon-s-release"
            @click="$router.push('/video/video/contentList')"
          >内容管理</el-button>
        </el-row> -->
      <!-- </el-row> -->
    </div>

    <el-table
      :data="list"
      border
      fit
      highlight-current-row
      style="width: 100%;"
      :element-loading-text="g.loadingStr"
      :header-cell-style="{background:g.mainColor}"
    >
      <el-table-column prop="businessName" label="内容创作者" align="center" />
      <el-table-column label="操作" align="center">
        <template slot-scope="{row}">
          <el-button size="small" type="success" @click="handleBlackDel(row)">解除黑名单</el-button>
        </template>
      </el-table-column>
    </el-table>
    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryList.currentPage"
      :limit.sync="queryList.pageSize"
      @pagination="getList"
    />
  </div>
</template>

<script>
import { getBlackList, worksBlacklistDeleteById } from '@/api/video'
import Pagination from '@/components/Pagination'
export default {
  name: 'BlackList',
  components: { Pagination },
  data() {
    return {
      queryList: {
        businessId: '',
        currentPage: 1,
        pageSize: 10
      },
      list: [],
      total: 0
    }
  },
  mounted() {
    this.getList()
  },
  methods: {
    handleBlackDel(row) {
      worksBlacklistDeleteById({
        'id': row.id
      }).then(res => {
        this.$message.success('解除成功')
        this.getList()
      })
    },
    getList() {
      getBlackList(this.queryList).then(res => {
        const { total, records } = res.data
        this.list = records
        this.total = total
      })
    }
  }
}
</script>

<style scoped lang='scss'>
.content {
  padding: 10px;
  .header{
      margin-bottom: 15px;
  }
}
</style>
